<template>
	<div>
		<div class="return-bar" @click="back()">
			<i class="iconfont">&#xe668;</i>
			申请贷款
		</div>

		<div class="apply-loan detail_top">
			<header>
				<span></span>
				申请人资料
			</header>

			<validator name="validation1">
				<form v-on:submit.prevent="apply">
					<ul class="detail">

						<li>
							<span class="txt">借款金额:</span>
							<input
							 @keyup="onKeyup "
							v-validate:account="{required:true}" v-model="postData.money" type="text" placeholder="请输入借款金额">元
						</li>

						<li>
							<span class="txt">借款期限:</span>
							<span class="content">
								<selector
								placeholder="请选择借款期限"
								:value.sync="postData.period"
								:options="borrow_period_list"
								></selector>
							</span>
						</li>

						<li>
							<span class="txt">收款人:</span>
							<span class="content">
								<selector
								placeholder="请选择收款人"
								:value.sync="postData.payee_uid"
								:options="payee"
								></selector>
							</span>
						</li>

						<li>
							<span class="txt">报单员:</span>
							<span class="content">
								<selector
								placeholder="请选择报单员"
								:value.sync="postData.bd_user"
								:options="bdList"
								></selector>
							</span>
						</li>

						<!-- <li>
							<span class="txt">图形验证码:</span>
							<input class="big"
							 @keyup="onKeyup "
							 v-validate:verify="{required:true}"  type="text" v-model="postData.verify"  placeholder="请输入图形验证码" />
							<img class="verify" v-show="show_img" src="{{img_src}}", @click="reloadImg" />
						</li> -->
					</ul>

					<div class="btn">
						<button style="width:100%" class="summit" type="submit">提交申请</button>
					</div>

				</form>
			</validator>

			<div class="note">注：如不提交申请, 返回时系统将自动为您保存</div>
			<toast :show.sync="show_toast">请认真填完以上资料,谢谢合作!</toast>
		</div>

        <com-alert
        :show.sync="alertData.show"
        :title.sync="alertData.title"
        :buttontxt.sync="alertData.buttontxt"
        :content.sync="alertData.content"
        ></com-alert>

	</div>



</template>

<style>
@import '~vux/dist/vux.css';
</style>

<script>
var vm = this;
import '../../assets/sass/user/loan.scss'
import {Api_Reg_Code, c_user_appy_loan, c_img_verify} from '../../config/api'
import { Selector, Group , Toast} from 'vux'
import ComAlert from '../../components/common/alert'
import api  from '../../data/api';
export default {

	data () {
		return {
			busy:false,
			show_toast:false,
			show_img:true,
			img_src:'',
            alertData:{show:false,title:'标题',buttontxt:'确定',  content:'sign' },

			postData:{
				money:'',//借款金额
				period:'',//借款期限
				payee_uid:'',//收款人
				bd_user:'',//报单专员
				verify:''
			},
			iData:[],
			payee:[],
			bdList:[],
			borrow_period_list: []
		}
	},
	components: {
		ComAlert,
		Group,
		Selector,
		Toast
	},

	ready(){
		for(var i=1;i<37;i++){
			this.borrow_period_list.push({
				key:i,
				value:i+'个月'
			})
		}

		//console.log(this.borrow_period_list)
	},

	methods: {
		back(){
			//window.history.back();
			this.$route.router.go('/loan');
		},

		onKeyup(key){
			if(key.keyCode == 13) this.apply();
			//console.log('112')
		},

		async apply() {
			var that = this;
			if (this.$validation1.invalid || this.busy) {
				that.show_toast = true;
				return false;
			}

			this.busy = true;
			/* this.idcard = [];
			this.idcard.push(this.idcard1_obj);
			this.idcard.push(this.idcard2_obj);

			var data = new FormData();

			for(var i in this.idcard){
				data.append("idcard[]",this.idcard[i]);
			}

			data.append('message', this.message);
			data.append('name', this.name);
			data.append('borrow_name_no_type', this.borrow_name_no_type);
			data.append('borrow_use', this.borrow_use);
			data.append('account', this.account);
			data.append('borrow_style', this.borrow_style);
			data.append('borrow_period', this.borrow_period);
			data.append('verify', this.verify);
			data.append('durationFlg', this.durationFlg);

			this.$http.post(c_user_appy_loan, data,'').then(function (response) {
					var rs = response.data;
					alert(rs.msg)
					if(rs.code =='30021'){
						this.reloadImg();
					}
					this.busy = false;
			}); */
			vm.$store.dispatch('setShowLoading', true);
			var res = await api.user.do_addBorrow(vm.postData);
			vm.$store.dispatch('setShowLoading', false);
			this.busy = false;
			if(res.status){
				setTimeout(function() {
					vm.$route.router.go('/loan/list')
				}, 2000);
			}else{
				vm.postData.verify = '';
				//vm.reloadImg();
			}

			vm.alertData = {show:true, title:'信息提示', buttontxt:'确定', content:res.msg};
		},

		reloadImg(){
			this.show_img = false;
			this.img_src = '';
			var that = this;
			//this.img_src = c_img_verify
			setInterval(function(){
				that.show_img = true;
				that.img_src = c_img_verify
			},1);

		},




		async fetch(){
			var res = await api.user.get_borrowUsers();

			vm.postData.user_id = res.data.user_id;
			//vm.postData.borrow_c_id = res.data.borrow_c_id;

			res = await api.user.get_selectList({c_id:res.data.borrow_c_id});

			vm.payee = [];
			vm.bdList = [];
            for(var i=0; i<res.payee_list.length;i++){
                vm.payee.push({
                    key: res.payee_list[i].user_id,
                    value: res.payee_list[i].realname
                });
			}

			console.log(res.bd_list.length);

            for(var i=0; i<res.bd_list.length;i++){
                vm.bdList.push({
                    key: res.bd_list[i].user_id,
                    value: res.bd_list[i].realname
                });
			}

			console.log(res);
		}

	},


	route: {
		activate ( transition ) {
			vm = this;
			/* if(sessionStorage.getItem("login")==null){
				this.$route.router.go('/login?from='+this.$route.path.substring(1))
				return false;
			} */
			//this.img_src = c_img_verify;

			transition.next();
			vm.fetch();
			document.title = '申请贷款 - 有喜财富';

		}
	}
}
</script>
